<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html>
<html>
<head>
    <%
        String contextPath = request.getContextPath();
        String basePath = request.getScheme() + "://"
                + request.getServerName() + ":" + request.getServerPort()
                + contextPath + "/";
    %>
    <base href="<%=basePath%>">
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <link rel="stylesheet" href="css/amazeui.min.css"/>
    <script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
    <link rel="stylesheet" href="css/zpwd/sjsz.css"/>
    <link rel="stylesheet" href="css/sui.css"/>
    <link rel="stylesheet" href="css/jd.css"/>
    <title></title>
    <style>
        /*.bottomLine {
            border-bottom: 1px solid #ccc;
            border-top: 1px solid #ccc;
            margin-bottom: 10px;
            /*padding: 10px;*/
        /*padding-top: 10px;
            padding-bottom: 10px;
            word-spacing: 0.05rem;
            text-align: center;
            margin-top: 82px;*/
        /*width:677px ;*/
        /*line-height: ;*/
        /*}*/

        .bottomLine {
            border-bottom: 1px solid #ccc;
            border-top: 1px solid #ccc;
            padding-top: 8px;
            /*padding-bottom:10px;*/
        }

        .bot {
            margin-bottom: 50px;
            /*text-align: center;*/
            color: #7b6f5b;
        }

        .radio-pretty.checked > span:before {
            color: #f88600;
        }

        input {
            height: 62px;
        }

        .imgbot {
            width: 128px;
            height: 128px;
        }

        .am-form-field {
            display: inline;
            width: 100%;
            width: 90%;
            padding: .5em;
            font-size: 1.6rem;
            line-height: 1.2;
            color: #555;
            vertical-align: middle;
            background-color: #fff;
            background-image: none;
            border: 1px solid #ccc;
            border-radius: 0;
            -webkit-appearance: none;
            -webkit-transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
            transition: border-color .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
            transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out, -webkit-box-shadow .15s ease-in-out;
        }
    </style>
</head>

<body>
<!--<div class="am-g" style="margin-top: 25px;">

</div>-->
<jsp:include page="update_email_header.jsp"></jsp:include>
<div style="background-color: #ffffff;padding-top: 30px;margin-top: 21px;">
    <div class="am-g content" style="margin-top: 45px;">
        <div data-am-widget="tabs" class="am-tabs am-tabs-d2">
            <ul class="am-tabs-nav1" style="margin-top: 20px;display:flex;list-style: none;text-align: center;">
                <li style="max-width: 95px; margin-left: 100px;"></li>
                <li style="max-width: 80px;"><span class="am-badge1 am-round am-badge-warning-active "
                                                   style="background-color: #F89406;font-size: 18px;">1</span>
                    <br/>
                    <p class="bottitle active">验证身份</p>
                </li>
                <li style="max-width: 273px;">
                    <hr style="width: 273px;    border-top: 3px #F89406 solid;">
                </li>
                <li style="max-width: 80px;margin-left: 10px;"><span class="am-badge1  am-round am-badge-warning-active"
                                                                     style="background-color: #F89406;font-size: 18px">2</span>
                    <br/>
                    <p class="bottitle active">修改邮箱</p>
                </li>
                <li style="max-width: 273px;">
                    <hr style="height: 3px;">
                </li>
                <li style="max-width: 80px;margin-left: 10px;"><span class="am-badge1  am-round"
                                                                     style="background-image: url(images/duihao.png);background-repeat: no-repeat;background-position: center;background-position-x: 5px;"></span>
                    <br/>
                    <p style="margin-left: -10px" class="bottitle">完成</p>
                </li>
            </ul>
            <!--输入账户名-->
            <div class="am-tabs-bd" style="margin-left: 200px;">
                <div data-tab-panel-0 class="am-tab-panel am-active" style="margin-top: 20px;">
                    <div class="am-g">
                        <img src="images/warning.png"/>
                        <span style="font-weight:bold;margin-left: 10px;font-size: 14px;color: #3d3d3d">我们不会泄露您的邮箱信息</span>
                    </div>

                    <div class="am-g" style="margin-top: 20px;margin-left: 55px;">
                        <span>新邮箱号:</span><input class="am-form-field" type="text"
                                                 style="width: 285px;height: 45px;margin-left: 22px;font-size:14px" id="email" placeholder="请输入新邮箱号"/>
                    </div>
                    <div class="am-g" style="margin-top: 20px;margin-left:50px;">
                        <input type="button"
                               style="width: 114px;height: 47px;margin-left: 80px; background-color: orange;color: #fff;border: 0px;border-radius: 5px;"
                               value="免费获取验证码" id="btn" onclick="sendVerifyToEmial('email', 'btn');"/>
                    </div>

                    <div class="am-g" style="margin-top: 20px;margin-left: 65px;">
                        <span>验证码:</span>
                        <input class="am-form-field" type="text"
                               style="width: 285px;height: 45px;margin-left: 22px;padding-left: 10px;font-size:14px"
                               placeholder="请入验证码" id="verify" oninput="checkVerify('verify', 'next_btn');"/>
                    </div>
                    <div class="am-g" style="margin-top: 30px;margin-left: 135px;">
                        <button type="button" class="am-btn am-btn-warning" id="next_btn" disabled
                                style="width: 265px;height: 50px;font-size: 16px;border: 1px rgba(187, 187, 187, 0.5)B solid;margin: 0 auto;border-radius: 5px;"
                                onclick="checkEmailVerifyCode('verify', 'user_center/update_email3.jsp', 'email')">
                            下一步
                        </button>
                    </div>
                    <div class="am-g"
                         style="padding-top:40px;padding-left:50px;border: 1px rgba(241,161,69, 0.18) solid;   margin-left:0px;margin-top:50px;height: 169px;width: 718px;background-color: #FEFBEE;">

                        <span style="font-size: 14px;font-weight: bold;">没收到验证码？</span>
                        <p style="font-size: 12px;margin-top: 10px;">1.网络通信异常可能会造成信息丢失，请重新获取或稍后重试</p>
                        <p style="font-size: 12px;margin-top: -16px;">2.请核实邮箱是否屏蔽了信息</p>
                    </div>

                </div>
            </div>
        </div>
    </div>
</div>
<jsp:include page="../common/footer2.jsp"></jsp:include>
</div>
<script src="js/common.js" type="text/javascript"></script>
</body>

</html>